<template>
  <div style="height: 100%">
    <el-container class="container">
      <el-aside width="50">
        <!--        <Aside style=""></Aside>-->
        <Financial_Server_Aside :menuData="menuData"></Financial_Server_Aside>

      </el-aside>
      <el-main>
        <router-view>
        </router-view>
      </el-main>

    </el-container>
  </div>
</template>

<script>
import menuData from "@/mock/financial-server.json";
import Aside from "@/components/Aside";
import Header from "@/components/Header";
import Main from "@/components/Main";
import Financial_Server_Aside from "@/views/financial_server/Financial_Server_Aside";
export default {
  name: "Index",
  components: {Financial_Server_Aside, Aside},
  data(){
    return{
      menuData,


    }
  },

  methods:{

  }

}
</script>


<style scoped>
.el-header, .el-footer {
  background-color: #B3C0D1;
  color: #333;
  text-align: center;
}

.el-aside {
  background-color: #D3DCE6;
  color: #a88787;
  text-align: center;
}

.el-main {
  background-color: #E9EEF3;

}

body > .el-container {
  margin-bottom: 40px;
  height: 100%;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}

.container{
  height: 100%;
  width: 100%;
  position: absolute;
}


</style>